import type { EChartsOption } from "echarts";

export function getOption(): EChartsOption {
  let colorList = ['#468FF7', '#00FED2', '#FFD37A','#468FF7', '#00FED2', '#FFD37A']
  let result = [
    {name:'单位工业增加值化学需氧量（COD排放量）',value:25},
    {name:'规模以上工业单位增加值二氧化碳排放量',value:55},
    {name:'规模以上工业单位增加值能耗',value:85},
    {name:'单位工业增加值化学需氧量（COD排放量）',value:65},
    {name:'工业固体废物综合利用率',value:45},
  ]
  return  {
    color:colorList,
    tooltip: {
      show: true,
      trigger: 'item',
      padding: [8, 15],
      backgroundColor: 'rgba(12, 51, 115,0.8)',
      borderColor: 'rgba(3, 11, 44, 0.5)',
      textStyle: {
        color: 'rgba(255, 255, 255, 1)'
      },
    },
    legend: {
      show: false,
    },
    grid: {
      left: '5%',
      right: '1%',
      top: '5%',
      bottom: '10%',
    },
    xAxis: [
      {
        splitLine: {
          show: false,
        },
        type: 'value',
        show: true,
      },
    ],
    yAxis: [
      {
        splitLine: {
          show: false,
        },
        axisLine: {
          show: false,
        },
        type: 'category',
        axisTick: {
          show: false,
        },
        inverse: true,
        data: result.map((item)=>item.name),
        axisLabel: {
          align: 'left',
          padding: [-10, -1550, 30, 10],
          color:'#ededed',
          formatter: (params:any,index:any) => {
              return params
          },
          rich: {
            value: {
              color: '#fff',
              fontSize: 14,
              fontWeight: 500,
            },
          },
        },
      },
      {
        gridIndex: 0,
        type: 'category',
        inverse: true,
        data: result,
        axisTick: { show: false },
        axisLine: { show: false },
        splitLine: { show: false },
        position: 'left',
        axisLabel: {
          color:'#ededed',
          width: 80,
          padding: [-10, 0, 30, 430],
          align: 'left',
          formatter: (name:any, index:any) => {
            return name;
          },
          rich: {
            value: {
              color: '#fff',
              fontSize: 14,
              fontWeight: 500,
            },
          },
        },
      },
    ],
    series: [
      {
        name: '吨',
        type: 'bar',
        barWidth: 10, // 柱子宽度
        showBackground: true,
        backgroundStyle: {
          color:'#194B72',
        },
        label: {
          show: false,
        },

        data: result.map((item,index)=>{
          return{
            name:item.name,
            value:item.value,
            itemStyle:{
              color:{
                type: "linear",
                x: 0,
                y: 0,
                x2: 1,
                y2: 1,
                colorStops: [
                  {
                    offset: 0,
                    color: "#0F1F45",
                  },
                  {
                    offset: 1,
                    color: colorList[index],
                  },
                ],
              }
            }
          }
        }),
      },
      {
        name: "外圆",
        type: "scatter",
        emphasis: {
          scale: false,
        },
        symbol: "rect",
        symbolSize: [5,16],
        itemStyle: {
          color: '#FFF',
          shadowColor: "rgba(255, 255, 255, 0.5)",
          shadowBlur: 5,
          borderWidth: 1,
          opacity: 1,
        },
        z: 2,
        data: result,
        animationDelay: 500,
      },
    ],
  };
}
